<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:include="base/include/head"></head>
<body>
	<!-- ==================================== -->
	<!-- ===============菜单栏=============== -->
	<div id="tb" style="padding: 5px; height: auto">
		<!-- 菜单名称：<input class="easyui-textbox" style="height: 21px; width: 180px"/> 
		<a href="#" class="easyui-linkbutton" iconCls="icon-search" onclick="menuPage()">搜索 </a> -->
		<a href="#" class="easyui-linkbutton" iconCls="icon-add"    onclick="openDilog()">新增</a> 
		<a href="#" class="easyui-linkbutton" iconCls="icon-help"   onclick="downloadExcel()">操作指南</a>
	</div>
	<table id="tt"></table>
	<!-- ==================================== -->
	<!-- ===============菜单栏=============== -->
	<!-- ==================================== -->
	
	<!-- ==================================== -->
	<!-- ===============资源栏=============== -->
	<!-- ==================================== -->
	<div id="tb_source" style="padding: 5px; height: auto">
		功能菜单：<select id="resourceFid" class="easyui-combobox" style="height: 21px; width: 180px" 
		 data-options="url:'../menu/comboboxMenuLevel3',valueField:'value',textField:'text'"></select> 
		<a href="#" class="easyui-linkbutton" iconCls="icon-search" onclick="sourcePage()">搜索 </a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-add"    onclick="openResourceDilog()">新增</a> 
		<a href="#" class="easyui-linkbutton" iconCls="icon-help"   onclick="downloadExcel()">操作指南</a>
	</div>
	<table id="tt_source"></table>
	<!-- ==================================== -->
	<!-- ===============资源栏=============== -->
	<!-- ==================================== -->
	
	<!-- 对话框 -->
	<div id="dd"></div>
	
	<!-- menu菜单项 -->
	<div id="mm" class="easyui-menu" style="width: 120px;">
		<div data-options="iconCls:'icon-edit',name:'update'">修改</div>
		<div data-options="iconCls:'icon-remove',name:'remove'" >移除</div>
		<div data-options="iconCls:'icon-search',name:'search'" >查看资源</div>
		<div data-options="iconCls:'icon-reload',name:'status'" >状态更改</div>
	</div>
	
	<!-- menu菜单项 -->
	<div id="mm_resouce" class="easyui-menu" style="width: 120px;">
		<div data-options="iconCls:'icon-edit',name:'update'">修改</div>
		<div data-options="iconCls:'icon-remove',name:'remove'" >移除</div>
		<div data-options="iconCls:'icon-reload',name:'status'" >状态更改</div>
	</div>
</body>
<script type="text/javascript">
/*<![CDATA[*/
    // 预加载区域
	$(function() {
		menuPage();
		sourcePage();
	});
	// =======================================================================================
	// =======================================================================================
	// =======================导航菜单内容区===================================================
	// =======================================================================================
	// =======================================================================================

	// 打开对话框
	function openDilog(id) {
		url = '../menu/createOrUpdateMenu'
		if(id != undefined){
			url += "?id="+id;	
		}
		$('#dd').dialog({
			title : '菜单',
			width : 400,
			height : 400,
			closed : false,
			cache : false,
			href : url,
			modal : true
		});
	}

	function menuPage() {
		// 查询页面信息 提交信息
		$('#tt').treegrid({
			title : '菜单信息管理',
			toolbar : '#tb',
			url : '../menu/queryTopMenus',
			method : 'POST',
			queryParams : {},
			idField : 'id',
			treeField : 'menuName',
			singleSelect : true,
			rownumbers : true,
			pagination : true,
			pageSize : 10,
			pageList : [ 10, 20, 50, 100 ],
			showFooter : true,
			fitColumns : true,
			onContextMenu: function(e, node){
				e.preventDefault();
				// 显示快捷菜单
				$('#mm').menu('show', {
					left: e.pageX,
					top: e.pageY,
					onClick: function(item){
						if(item.name == 'remove'){
							$.messager.confirm('确认', '您确定要删除菜单信息吗（子菜单也将同时被删除）？', function(r){
								if (r){
									$.ajax({
										type : "POST",
										url : '../menu/deleteMenu',
										data : {
											id : node.id
										},
										dataType : "json",
										async : false,
										success : function(data) {
											$('#tt').treegrid('remove', node.id);
										},
										error : function(e) {
											alert("确认失败！");
										}
									});
								}
							});
						}else if(item.name == 'update'){
							openDilog(node.id);
						}else if(item.name == 'search'){
							$("#resourceFid").combobox('setValue',node.id).combobox('setText',node.menuName);
							sourcePage();
						}else if(item.name == 'status'){
							$.messager.confirm('确认', '您确定要变更状态吗？', function(r){
								if (r){
									$.ajax({
										type : "POST",
										url : '../menu/updateMenuStatus',
										data : {
											id : node.id
										},
										dataType : "json",
										async : false,
										success : function(data) {
											if(data.status){
												menuPage();
											}else{
												$.messager.alert("错误！",data.msg);
											}
										},
										error : function(e) {
											alert("确认失败！");
										}
									});
								}
							});
						}
					}
				});
			},
			onClickRow : function(row) {
				var nodes = $('#tt').treegrid('getChildren', row.id);
				var flag = true;
				for (i = 0; i < nodes.length; i++) {
					if (nodes[i].menuLevel == 1) {
						$('#tt').treegrid('remove', nodes[i].id);
						flag = false;
					}
					if (flag) {
						$('#tt').treegrid('remove', nodes[i].id);
					}

				}
				$.ajax({
					type : "POST",
					url : '../menu/queryMenusByFid',
					data : {
						fid : row.id
					},
					dataType : "json",
					async : false,
					success : function(data) {
						if (data.length > 0) {
							$('#tt').treegrid('append', {
								parent : row.id,
								data : data
							});
						}
					},
					error : function(e) {
						alert("确认失败！");
					}
				});

			},
			columns : [ [ {
				field : 'menuName',
				title : '名称',
				width : 200,
				align : 'left'
			}, {
				field : 'menuDesc',
				title : '描述',
				width : 200,
				align : 'center'
			}, { 
				field : 'menuLevel',
				title : '菜单级别',
				width : 100,
				align : 'center',
				formatter : function(value, row, index) {
					if (row.menuLevel == '0') {
						return "第一级别";
					} else if (row.menuLevel == '1') {
						return "第二级别";
					} else if (row.menuLevel == '2') {
						return "功能菜单";
					} else {
						return "未定义";
					}
				}
			}, {
				field : 'orderLevel',
				title : '排序号',
				width : 50,
				align : 'center'
			}, {
				field : 'menuLink',
				title : '页面链接',
				width : 200,
				align : 'center'
			}, {
				field : 'menuPermission',
				title : '页面权限码',
				width : 200,
				align : 'center'
			}, {
				field : 'menuIcon',
				title : '图标',
				width : 200,
				align : 'center'
			}, {
				field : 'pageType',
				title : '页面类型',
				width : 100,
				align : 'center'
			}, {
				field : 'status',
				title : '状态',
				width : 100,
				align : 'center',
				formatter : function(value, row, index) {
					if (row.status == '0') {
						return "失效";
					} else if (row.status == '1') {
						return "【启用 】";
					}
				}
			} ] ]  
		}).datagrid('resize',{   
	        height:($(window).height()/2-20)   
	    });
	}
	// 查找父菜单信息	
	function findMenus(){
		var menuLevel = $("#menuLevel").combobox("getValue");
		if(menuLevel == 1){
			// 加载第2级别的菜单
			$("#fid").combobox('readonly',false); 
			getFMenus(1);
		}else if(menuLevel == 2){
			// 加载第3级别的菜单
			$("#fid").combobox('readonly',false); 
			getFMenus(2);
		}else{
			// 取出菜单信息 并设置无法编辑
			$("#fid").combobox('readonly',true);
			getFMenus(0);
		}
	}
	// 获取父菜单里 
	function getFMenus(level){
		$.ajax({
			type : "POST",
			url : '../menu/findMenusByLevel',
			data : {
				menuLevel : level
			},
			dataType : "json",
			async : false,
			success : function(data) {
				var option = [];
				if(data.length>0){
					for(var i = 0 ;i<data.length;i++){
						option.push({"text":data[i].menuName,"value":data[i].id});
					}
				}
				$("#fid").combobox("loadData",option);
			},
			error : function(e) {
				alert("请求后台父菜单信息异常！");
			}
		});
	}
	
	// 保存更新菜单信息
	function saveOrUpdateMenu(url){
		 $.ajax({
			   type:"POST",
			   url:url,
			   data:$('#formBox').serialize(),
			   dataType : "json",
			   async: false,
			   success:function(data){
				   if(data.status){
					   $('#tt').treegrid('reload');
					   $('#dd').dialog('close');
					   $.messager.alert('通知','完成！');
				   }else{
					   $.messager.alert('校验',data.msg[0].defaultMessage);
				   }
			   },
			   error : function(e) {
				   alert("确认失败！");
				}
			  });
	}
	// =======================================================================================
	// =======================================================================================
	// =======================资源菜单内容区===================================================
	// =======================================================================================
	// =======================================================================================
	function sourcePage() {
		// 查询页面信息 提交信息
		$('#tt_source').datagrid({
			title : '资源信息管理',
			toolbar : '#tb_source',
			url : '../resource/queryResources',
			method : 'POST',
			queryParams : {
				id : $('#resourceFid').combobox('getValue')
			},
			singleSelect : true,
			rownumbers : true,
			pagination : true,
			pageSize : 10,
			pageList : [ 10, 20, 50, 100 ],
			showFooter : true,
			fitColumns : true,
			onRowContextMenu: function(e, rowIndex, rowData){
				e.preventDefault();
				// 显示快捷菜单
				$('#mm_resouce').menu('show', {
					left: e.pageX,
					top: e.pageY,
					onClick: function(item){
						if(item.name == 'remove'){
							$.messager.confirm('确认', '您确定要删除菜单信息吗（子菜单也将同时被删除）？', function(r){
								if (r){
									$.ajax({
										type : "POST",
										url : '../resource/deleteResource',
										data : {
											id : rowData.id
										},
										dataType : "json",
										async : false,
										success : function(data) {
											$('#tt_source').datagrid('reload');
										},
										error : function(e) {
											alert("确认失败！");
										}
									});
								}
							});
						}else if(item.name == 'update'){  
							openResourceDilog(rowData.id);
						}else if(item.name == 'status'){
							$.messager.confirm('确认', '确定变更状态吗？', function(r){
								if (r){
									$.ajax({
										type : "POST",
										url : '../resource/updateResourceStatus',
										data : {
											id : rowData.id
										},
										dataType : "json",
										async : false,
										success : function(data) {
											$('#tt_source').datagrid('reload');
										},
										error : function(e) {
											alert("确认失败！");
										}
									});
								}
							});
						}
					}
				});
			},
			onClickRow : function(row) {
			},
			columns : [ [ {
				field : 'resName',
				title : '名称',
				width : 200,
				align : 'center'
			}, {
				field : 'resDesc',
				title : '描述',
				width : 200,
				align : 'center'
			}, {
				field : 'resLink',
				title : '资源链接',
				width : 200,
				align : 'center'
			}, {
				field : 'resPermission',
				title : '资源权限码',
				width : 200,
				align : 'center'
			}, {
				field : 'status',
				title : '启用状态',
				width : 70,
				align : 'center',
				formatter : function(value, row, index) {
					if (row.status == '0') {
						return "失效";
					} else if (row.status == '1') {
						return "[生效]";
					} else {
						return "未定义";
					}
				}
			} ] ]  
		}).datagrid('resize',{   
	        height:($(window).height()/2-20)   
	    });
	}
	
	// 打开对话框
	function openResourceDilog(id) {
		url = '../resource/createOrUpdateResource'
		if(id != undefined){
			url += "?id="+id;	
		}
		$('#dd').dialog({
			title : '资源操作',
			width : 400,
			height : 300,
			closed : false,
			cache : false,
			href : url,
			modal : true
		});
	}
	
	// 保存更新菜单信息
	function saveOrUpdateResource(url){
		 $.ajax({
			   type:"POST",
			   url:url,
			   data:$('#formBox').serialize(),
			   dataType : "json",
			   async: false,
			   success:function(data){
				   if(data.status){
					   $('#tt_source').datagrid('reload');
					   $('#dd').dialog('close');
					   $.messager.alert('通知','完成！');
				   }else{
					   $.messager.alert('校验',data.msg[0].defaultMessage);
				   }
			   },
			   error : function(e) {
				   alert("确认失败！");
				}
			  });
	}
	/*]]>*/
</script>
</html>